<!doctype html>
<html lang="zh-CN">
<head>
    <meta charset="utf-8">
</head>
<body>

   
    <!--头部-->
    <span id="header"></span>

    <div class="auth-main clearfix">
        <!--侧边导航-->
        <span id="nav"></span>

        <!--内容区域-->
        <div  class="main main-width-mid">
            <div class="ibox-title">
                <h5 style="color: #666">评价买家</h5>
            </div>

            <div class="ibox-content m-t clearfix" style="height: 80px;">
                <div class="m-timeline">
                    <div class="line">
                        <div class="dot"></div>
                        <div class="dot" style="left: 12.5%;"></div>
                        <div class="dot" style="left: 25%;"></div>
                        <div class="dot" style="left: 37.5%;"></div>
                        <div class="dot active" style="left: 50%;"></div>
                        <div class="dot" style="left: 62.5%;"></div>
                        <div class="dot" style="left: 75%;"></div>
                        <div class="dot" style="left: 87.5%;"></div>
                        <div class="dot" style="right: 0"></div>

                        <span>确认订单</span>
                        <span style="left: 10%;">卖家确认订单</span>
                        <span style="left: 22.5%;">买家付款</span>
                        <span style="left: 35%;">卖家发货</span>
                        <span style="left: 47.5%;">买家确认收货</span>
                        <span style="left: 60%;">卖家邮寄发票</span>
                        <span style="left: 72.5%;">买家确认发票</span>
                        <span style="left: 85%;">交易成功</span>
                        <span style="right: 0;">确认订单</span>
                    </div>
                </div>
            </div>

            <div class="ibox-content" style="padding-bottom: 10px">
                <table class="table  u-table-center" style="margin-bottom: 10px;">
                    <thead>
                    <tr>
                        <th>订单编号</th>
                        <th>供应商</th>
                        <th>订单日期</th>
                        <th>订单金额</th>
                        <th>付款约定</th>
                        <th>订单状态</th>
                        <th>成交事件</th>
                    </tr>
                    </thead>
                    <tbody>
                    <tr>
                        <td>3254365748</td>
                        <td>XXX公司</td>
                        <td>2017-09-09</td>
                        <td style="color: #FF5A5F;">¥ 160000.00</td>
                        <td>预付款30%</td>
                        <td>已发货</td>
                        <td>2017-09-09 20:28:10</td>
                    </tr>
                    </tbody>
                </table>
            </div>

            <div class="ibox-content m-t">
                <table class="table table-bordered  u-table-center">
                    <thead>
                    <tr>
                        <th>物品名称</th>
                        <th>品牌</th>
                        <th>型号</th>
                        <th>单价</th>
                        <th>数量</th>
                        <th>总价</th>
                    </tr>
                    </thead>
                    <tbody>
                    <tr>
                        <td>ABC</td>
                        <td>asrg</td>
                        <td>xxxxxx</td>
                        <td style="color: #FF5A5F;">1600.00</td>
                        <td>10</td>
                        <td style="color: #FF5A5F;">16000.00</td>
                    </tr>
                    <tr>
                        <td>ABC</td>
                        <td>asrg</td>
                        <td>xxxxxx</td>
                        <td style="color: #FF5A5F;">1600.00</td>
                        <td>10</td>
                        <td style="color: #FF5A5F;">16000.00</td>
                    </tr>
                    <tr>
                        <td>ABC</td>
                        <td>asrg</td>
                        <td>xxxxxx</td>
                        <td style="color: #FF5A5F;">1600.00</td>
                        <td>10</td>
                        <td style="color: #FF5A5F;">16000.00</td>
                    </tr>
                    </tbody>
                </table>
                <span class="pull-right" style="color: #FF5A5F; font-size: 16px">合计:1000.00</span>
            </div>

            <div class="ibox-title">
                <h5 style="color: #C2343A">评分</h5>
            </div>

            <div class="ibox-content">
                <div class="col-xs-offset-2">
                    <div class="form-group" style="display: inline-block; margin-right: 40px">
                        <label class="m-radio-con">
                            <i class="iconfont icon-danxuanhongse"></i>
                            <input type="radio" name="bank" checked>
                            <span>好评</span>
                        </label>
                    </div>
                    <div class="form-group" style="display: inline-block; margin-right: 40px">
                        <label class="m-radio-con">
                            <i class="iconfont icon-danxuanhuise"></i>
                            <input type="radio" name="bank">
                            <span>中评</span>
                        </label>
                    </div>
                    <div class="form-group" style="display: inline-block; margin-right: 40px">
                        <label class="m-radio-con">
                            <i class="iconfont icon-danxuanhuise"></i>
                            <input type="radio" name="bank">
                            <span>差评</span>
                        </label>
                    </div>
                </div>
                <div class="form-horizontal">
                    <div class="form-group">
                        <label class="col-xs-2 control-label">评价:</label>
                        <div class="col-xs-8">
                            <textarea rows="4" class="form-control" placeholder="请输入评论"></textarea>
                        </div>
                    </div>

                    <div class="form-group">
                        <label class="col-xs-2 control-label"></label>
                        <div class="col-xs-8">
                            <button type="button" class="btn btn-danger" style="width: 120px; height: 36px">提交评价</button>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <!--页尾-->
    <span id="footer"></span>
  </body></html>
<script src="../common/js/jquery-1.9.1.js"></script>
<script type="text/javascript">
    $.get('../common/html/head.html', function (data) {
        $('head').html(data)
    });

    $.get('../common/html/header.html', function (data) {
        $('#header').html(data)
    });

    $.get('../common/html/nav.html', function (data) {
        $('#nav').html(data)
    });

    $.get('../common/html/footer.html', function (data) {
        $('#footer').html(data)
    });
</script>

<script>
    // 单选按钮切换
    $('.m-radio-con').on('click', 'input',function () {
        var $radio = $(this);

        $radio.on('change', function () {
            var flag = $radio.prop('checked');
            console.log(flag);
            if (flag) {
                $('input[type=radio]', '.m-radio-con').prev('.iconfont').removeClass('icon-danxuanhongse').addClass('icon-danxuanhuise');
                $radio.prev('.iconfont').removeClass('icon-danxuanhuise').addClass('icon-danxuanhongse');
            }
        })
    });
</script>